import React from 'react'
import { Outlet, useNavigate } from 'react-router-dom'
import { Tabbar } from 'react-vant'
import { childroutes } from '../router'
function Mytabbar() {
  let nav = useNavigate()
  return (
    <div>
      {/* tabbar */}
      <Tabbar onChange={(path) => {
        // 跳转对应的页面
        return nav(path)
      }}>
        {
          // 长度判断，并进行渲染
          childroutes.length > 0 && childroutes.map((item, index) => {
            return <Tabbar.Item key={index} name={item.path} icon={item.icon}></Tabbar.Item>
          })
        }

      </Tabbar>
    </div>
  )
}

export default Mytabbar
